{% extends 'base.html.twig' %}
{% import 'Import/app_import.html.twig' as appImport %}

{% block head_title %}{{ 'elasticsearch_users'|trans }} - {{ user.name }} - {{ 'update'|trans }}{% endblock %}

{% block heading_1 %}
    {{ appImport.heading({'level': 1, 'title': 'elasticsearch_users'|trans, 'link': {'url': path('elasticsearch_users')}}) }}
{% endblock %}

{% block heading_2 %}
    {{ appImport.heading({'level': 2, 'title': user.name}) }}
{% endblock %}

{% block tabs %}
    {% include 'Modules/user/user_read_tabs.html.twig' with {'active': 'update'} %}
{% endblock %}

{% block main_content %}
    {% embed 'Embed/block_embed.html.twig' %}
        {% import 'Import/app_import.html.twig' as appImport %}
        {% block content %}
            {{ appImport.heading({'level': 3, 'title': 'update'|trans}) }}

            {% embed 'Embed/buttons_embed.html.twig' %}
                {% import 'Import/app_import.html.twig' as appImport %}
                {% block content %}
                    <a class="btn btn-secondary btn-sm" rel="noreferrer" target="_blank" href="https://www.elastic.co/guide/en/elasticsearch/reference/current/security-api-put-user.html#security-api-put-user">
                        {{ 'help'|trans }}
                    </a>
                {% endblock %}
            {% endembed %}

            {{ appImport.form({'form': form}) }}
        {% endblock %}
    {% endembed %}
{% endblock %}

{% block scripts %}
    {{ parent() }}

    <script type="text/javascript">
        var dataChangePassword = document.getElementById('data_change_password');
        var dataPassword = document.getElementById('data_password');

        function changePassword() {
            if (true === dataChangePassword.checked) {
                var badge = ' <small class="form-required {{ theme_form_required }}">{{ 'required'|trans|escape('js') }}</small>';

                dataPassword.removeAttribute('disabled');
                dataPassword.setAttribute('required', 'required');

                var dataPasswordLabel = document.querySelector('label[for="data_password"]');
                dataPasswordLabel.insertAdjacentHTML('beforeend', badge);
            } else {
                dataPassword.setAttribute('disabled', 'disabled');
                dataPassword.removeAttribute('required');

                var dataPasswordLabelBadge = document.querySelector('label[for="data_password"] .badge');
                if (dataPasswordLabelBadge) {
                    dataPasswordLabelBadge.parentNode.removeChild(dataPasswordLabelBadge);
                }
            }
        }

        changePassword();

        dataChangePassword.addEventListener('click', function(event) {
            changePassword();
        });
    </script>
{% endblock %}
